<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>Aurum - Bootstrap 4 Ecommerce Template</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<link rel="shortcut icon" href="images/favicon.ico">
		<link rel="stylesheet" href="bootstrap/css/bootstrap.css">
		
		<script defer src="js/fontawesome.js"></script>
		
		<link rel="stylesheet" href="css/style.css">
	</head>
	<body>
	
		<section class="header text-center">
			<nav class="navbar navbar-expand-lg navbar-light navbar-custom">
				<div class="container"><a class="navbar-brand" href="index.html"><i class="fas fa-shopping-bag primary-color mr-1"></i> Aurum</a>
					<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar-1" aria-controls="navbar-1" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
					<div class="collapse navbar-collapse pull-xs-right justify-content-end" id="navbar-1">
						<ul class="navbar-nav mt-2 mt-md-0">
							<li class="nav-item active"><a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a></li>
							<li class="nav-item dropdown mega-menu"><a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Shop </a>
								<div class="dropdown-menu" aria-labelledby="navbarDropdown">
									<div class="container">
										<div class="divider"></div>
										<div class="row">
											<div class="col-md-2">
												<h6 class="text-uppercase">Women's</h6>
												<ul class="nav flex-column">
													<li class="nav-item"><a class="nav-link active" href="#">Active</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
												</ul>
											</div>
											<div class="col-md-2">
												<h6 class="text-uppercase">Men's</h6>
												<ul class="nav flex-column">
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
												</ul>
											</div>
											<div class="col-md-2">
												<h6 class="text-uppercase">Girl's</h6>
												<ul class="nav flex-column">
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
												</ul>
											</div>
											<div class="col-md-2">
												<h6 class="text-uppercase">Boy's</h6>
												<ul class="nav flex-column">
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
													<li class="nav-item"><a class="nav-link" href="#">Link item</a></li>
												</ul>
											</div>
											<div class="col-md-4">
												<h6 class="text-uppercase">Featured Items</h6>
												<div class="row">
													<div class="col-6 text-center"><a href="item.html">
														<img src="images/placeholder-product.jpg" alt="" class="img-fluid mt-2 mb-3"></a>
														<h6 class="mb-0"><a href="item.html">Product Name</a></h6>
														<p><span class="emphasis">$49.00</span></p>
														<a href="#" class="btn btn-sm btn-outline-secondary mt-0">Buy Now</a>
												<p></div>
													<div class="col-6 text-center"><a href="item.html">
														<img src="images/placeholder-product.jpg" alt="" class="img-fluid mt-2 mb-3"></a>
														<h6 class="mb-0"><a href="item.html">Product Name</a></h6>
														<p><span class="emphasis">$49.00</span></p>
														<a href="#" class="btn btn-sm btn-outline-secondary mt-0">Buy Now</a>
												<p></div>
												</div>
											</div>
										</div>
									</div>
								</div>
							</li>
							<li class="nav-item dropdown"><a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Pages </a>
								<div class="dropdown-menu" aria-labelledby="navbarDropdown"><a class="dropdown-item" href="index.html">Homepage</a>
									<div class="dropdown-divider"></div>
									<a class="dropdown-item" href="catalog.html">Catalog</a>
									<a class="dropdown-item" href="item.html">Item Detail</a>
									<a class="dropdown-item" href="cart.html">Cart</a>
									<div class="dropdown-divider"></div>
									<a class="dropdown-item" href="contact.html">Contact</a></div>
							</li>
							<li class="nav-item"><a class="nav-link" href="contact.html">Contact</a></li>
							<li class="nav-item dropdown"><a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-shopping-cart"></i> <span class="badge badge-pill badge-primary">3</span></a>
								<div class="dropdown-menu dropdown-menu-right dropdown-cart" aria-labelledby="navbarDropdown">
									<h6>3 Items <span class="emphasis">$147.00</span></h6>
									<div class="dropdown-divider"></div>
									<ul class="shopping-cart-items">
										<li class="row">
											<div class="col-3">
												<img src="images/placeholder-product.jpg" width="60">
											</div>
											<div class="col-9">
												<h6><a href="item.html">Product Name</a></h6>
												<span class="text-muted">1x</span>
												<span class="emphasis">$49.00</span></div>
										</li>
										<li class="row">
											<div class="col-3">
												<img src="images/placeholder-product.jpg" width="60">
											</div>
											<div class="col-9">
												<h6><a href="item.html">Product Name</a></h6>
												<span class="text-muted">1x</span>
												<span class="emphasis">$49.00</span></div>
										</li>
										<li class="row">
											<div class="col-3">
												<img src="images/placeholder-product.jpg" width="60">
											</div>
											<div class="col-9">
												<h6><a href="item.html">Product Name</a></h6>
												<span class="text-muted">1x</span>
												<span class="emphasis">$49.00</span></div>
										</li>
									</ul>
									
									<a href="cart.html" class="btn btn-lg btn-full-width btn-primary" style="margin: 0;">View Cart</a></div>
							</li>
						</ul>
					</div>
				</div>
			</nav>
		</section>
		
		<section class="contact">
			<div id="map"></div>
			<script src="js/maps.js"></script>
			<!--YOU MUST REPLACE WITH YOUR OWN API KEY FOR THE MAP TO WORK-->
			<script async defer
				src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBptaDKT_ntSoNEytCnSang5JenaNAj_Us&callback=initMap">
			</script>
			<div class="container">
				<div class="row contact-details">
					<div class="col-sm-8 text-center text-md-left">
						<h3 class="mb-4">Ask us a question</h3>
						<p class="mb-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus venenatis velit vestibulum massa sollicitudin auctor. Cras ac venenatis orci. Ut consequat, purus ut ultrices ultricies, nisi sem ornare quam, sed ultricies mi nisl sit amet purus.</p>
						<form class="contact-form mt-4">
							<div class="row">
								<div class="col-md-5">
									<input type="text" class="form-control mb-4" placeholder="Name" value="Your name">
								</div>
								<div class="col-md-5">
									<input type="text" class="form-control mb-4" placeholder="Email address" value="Email address">
								</div>
								<br />
							</div>
							<div class="row">
								<div class="col-md-10">
									<textarea class="form-control mb-4" rows="5" style="height: 10em!important;">Your Message</textarea>
									<br />
									<button type="submit" class="btn btn-outline-primary btn-lg mb-4">Send Message</button>
								</div>
							</div>
						</form>
					</div>
					<div class="col-sm-4 mb-5 text-center text-md-left">
						<h3>Contact</h3>
						<h4 class="pt-4">Email</h4>
						<p>hello@example.com</p>
						<h4 class="pt-2">Phone</h4>
						<p>+111 234 567 89</p>
						<h4 class="pt-2">Address</h4>
						<p>1 Street Name, City, Zip Code
							<br />United States
						</p>
						<ul class="social">
							<li><a href="#" title="Facebook"><i class="fab fa-facebook-f"></i></a></li>
							<li><a href="#" title="Twitter"><i class="fab fa-twitter"></i></a></li>
							<li><a href="#" title="Google+"><i class="fab fa-google"></i></a></li>
							<li><a href="#" title="Dribbble"><i class="fab fa-dribbble"></i></a></li>
							<li><a href="#" title="Instagram"><i class="fab fa-instagram"></i></a></li>
							<div class="clear"></div>
						</ul>
					</div>
				</div>
			</div>
		</section>
		
		<footer class="footer">
			<div class="container">
				<div class="row mb-5 text-center">
					<div class="col-sm-6 col-md-3 pt-2">
						<h5>Women's</h5>
						<ul class="nav-footer">
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
						</ul>
					</div>
					<div class="col-sm-6 col-md-3 pt-2">
						<h5>Men's</h5>
						<ul class="nav-footer">
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
						</ul>
					</div>
					<div class="col-sm-6 col-md-3 pt-2">
						<h5>Girl's</h5>
						<ul class="nav-footer">
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
						</ul>
					</div>
					<div class="col-sm-6 col-md-3 pt-2">
						<h5>Boy's</h5>
						<ul class="nav-footer">
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
							<li class="nav-item"><a class="nav-link" href="#">Link Item</a></li>
						</ul>
					</div>
				</div>
			</div>
			
			<div class="container-fluid">
				<div class="divider"></div>
			</div>
			
			<div class="container">
				<div class="row">
					<div class="col-md-6 text-center text-md-left mt-2 mb-3 pt-1">
						<p class="copyright">Copyright &copy; Example. Theme by <a href="https://xmoban.cn">xmoban.cn</a>.</p>
					</div>
					<div class="col-md-6 text-center text-md-right mb-4">
						<ul class="social">
							<li><a href="#" title="Facebook"><i class="fab fa-facebook-f"></i></a></li>
							<li><a href="#" title="Twitter"><i class="fab fa-twitter"></i></a></li>
							<li><a href="#" title="Google+"><i class="fab fa-google"></i></a></li>
							<li><a href="#" title="Dribbble"><i class="fab fa-dribbble"></i></a></li>
							<li><a href="#" title="Instagram"><i class="fab fa-instagram"></i></a></li>
							<div class="clear"></div>
						</ul>
					</div>
				</div>
			</div>
		</footer>
		
		<!-- Placed at the end of the document so the pages load faster -->
		<script src="js/jquery-3.1.1.min.js"></script>
		<script src="bootstrap/js/bootstrap.min.js"></script>
		<script src="js/tether.min.js"></script>
		<script src="js/popper.min.js"></script>
		
	</body>
</html>